<template>
  <Modal
    :closable="true"
    :mask-closable="true"
    width="700"
    v-model="modal"
    title="审核详情"
    footer-hide
  >
    <div class="flex-end">
      <Page
        :total="total"
        @on-change="changePage"
        show-total
        show-elevator
        :page-size="query.pageSize"
        :current="query.page"
      />
    </div>
    <Table :columns="showColumns" :data="list"></Table>
  </Modal>
</template>
<script>
import { reportStatis } from '@/api/compitionStatic';
import SearchTable from '@/components/SearchTable/SearchTable';

export default {
  name: 'ReportManage',
  components: {
    SearchTable
  },
  props: ['isDefend', 'sceneId'],
  mixins: [],
  data() {
    return {
      query: {
        testId: this.sceneId || this.$route.query.id,
        teamId: '',
        company: '',
        page: 1,
        status: 2,
        pageSize: 10
      },
      modal: false,
      total: 0,
      list: [],
      reportCol: [
        // {
        //   title: '团队名称',
        //   key: 'groupName',
        //   align: 'center',
        //   ellipsis: true,
        //   tooltip: true,
        //   placement: 'top-left',
        //   order: 1
        // },
        {
          title: '目标',
          key: 'targetName',
          align: 'center',
          ellipsis: true,
          tooltip: true,
          width: 100,
          placement: 'top-left'
        },
        {
          title: '单位',
          key: 'company',
          align: 'center',
          ellipsis: true,
          tooltip: true,
          width: 100,
          show: this.isDefend ? false : true,
          placement: 'top-left'
        },
        {
          title: '分值',
          key: 'score',
          align: 'center',
          width: 80,
          tooltip: true
        },
        {
          title: '审核理由',
          key: 'approvalInfo',
          align: 'center',
          ellipsis: true,
          tooltip: true
        },
        {
          title: '裁判',
          key: 'userName',
          align: 'center',
          ellipsis: true,
          tooltip: true,
          width: 100
        },
        {
          title: '审核时间',
          key: 'approvalTime',
          align: 'center',
          ellipsis: true,
          tooltip: true,
          width: 180
        }
      ]
    };
  },
  computed: {
    showColumns() {
      return this.reportCol.filter((col) => col.show != false);
    }
  },
  watch: {},
  created() {
    this._query = { ...this.query };
  },
  mounted() {},
  methods: {
    openModal(query) {
      this.query = { ...this._query, ...query };
      this.getReportStatic();
      this.modal = true;
    },
    getReportStatic() {
      if (this.sceneId || this.$route.query.id) {
        reportStatis(this.query).then((data) => {
          if (data.code == 1) {
            let list = data.data.pageData;
            this.list = list;
            this.total = data.data.totalCount;
          }
        });
      }
    },
    changePage(page) {
      this.query.page = page;
      this.getReportStatic();
    }
  }
};
</script>

<style scoped>
.flex-end {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 20px;
}
</style>
